<template>
  <div class="table-padding">
    <el-form :inline="true" :model="formInline" size="mini" :label-width="100" >
      <el-form-item label="订单号：" >
        <el-input v-model="formInline.CREATE_USER_NAME"
                  placeholder="订单号"></el-input>
      </el-form-item>
      <el-form-item label="提交时间：" :label-width="formLabelWidth">
                    <el-date-picker v-model="formInline.CREATE_USER_NAME" type="date"
                                    value-format="yyyy-MM-dd"
                                    placeholder="提交时间"></el-date-picker>
                </el-form-item>
      <el-form-item class="float-right">
        <el-button type="primary" @click="searchRecord" icon="el-icon-search">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column label="序号" type="index" align="center" width="50"></el-table-column>
      <el-table-column
        prop="province"
        label="提交时间"
        align="center"
        width="100">
      </el-table-column>
      <el-table-column
        prop="address"
        label="订单号"
        align="center"
        width="180">
      </el-table-column>
      <el-table-column
        prop="date"
        label="订单内容"
        align="center"
        width="190">
      </el-table-column>
      <el-table-column
        prop="city"
        label="金额"
        align="center"
        width="100">
      </el-table-column>
      <el-table-column
        prop="name"
        label="全部状态"
        sortable
        align="center"
        width="120">
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        width="120">
        <template slot-scope="scope">
          <el-button type="text" size="small">取消</el-button>
          <el-button @click="handleClick(scope.row)" type="text" size="small">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination :msg="page" @refreshList="onRefresList"></pagination>
  </div>

</template>

<script>
  import pagination from '../../views/localPage/pagination'
  export default {
    components:{pagination},
    name: "MyOrder",
    data() {
      return {
        page:{
          pagesize:4,
          total:900,
        },
        tableData: [{
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄111111',
          zip: 200333
        }, {
          date: '2016-05-04',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1517 弄',
          zip: 200333
        }, {
          date: '2016-05-01',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1519 弄',
          zip: 200333
        }, {
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1516 弄',
          zip: 200333
        }],
        formInline:{},
      }
    },
    methods: {
      handleClick(row) {
        console.log(row);
      },
      searchRecord(){

      },
      onRefresList(val){
        console.log(val)
      }
    },

  }
</script>

<style scoped>
  .table-padding{
    padding: 20px;
  }
</style>
